<ng-container *reqRolesIf="content">
  <!-- dialog -->
  @if (content.dialog) {
    <div *ngTemplateOutlet="action; context: { link: content }"></div>
  } @else {
    <!-- absolute link -->
    @if (isAbsolute(content.href || '')) {
      <a
        contentedit="label"
        [ngClass]="classes"
        [matTooltip]="content.tooltip?.message || ''"
        [matTooltipPosition]="content.tooltip?.position || 'above'"
        [href]="content.href || 'javascript:void(0);'"
        [target]="content.target || '_self'"
        [innerHTML]="content.label | safeHtml"
        title="{{ content.label }}"
        rel="noopener"
        (click)="nav($event)"
      ></a>
    } @else {
      @if (content.href) {
        <!-- drawer -->
        @if (content.rel && content.rel === 'drawer') {
          <div *ngTemplateOutlet="action; context: { link: content }"></div>
        } @else {
          <a
            contentedit="label"
            [matTooltip]="content.tooltip?.message || ''"
            [matTooltipPosition]="content.tooltip?.position || 'above'"
            [routerLink]="[content.href]"
            [routerLinkActive]="['active']"
            [target]="content.target || '_self'"
            [routerLinkActiveOptions]="{ exact: true }"
            [queryParams]="content.queryParams"
            [fragment]="content.fragment"
            [ngClass]="classes"
            [innerHTML]="content.label | safeHtml"
            [title]="content.label"
            (click)="nav($event)"
            >
          </a>
        }
        <!-- router link -->
      } @else {
        <div *ngTemplateOutlet="action; context: { link: content }"></div>
      }
    }
    <!-- relative link /node/1 -->
  }
  <!-- link -->
</ng-container>

<ng-template let-link="link" #action>
  <a
    contentedit="label"
    [matTooltip]="content.tooltip?.message || ''"
    [matTooltipPosition]="content.tooltip?.position || 'above'"
    [ngClass]="classes"
    href="javascript:void(0);"
    [target]="link.target || '_self'"
    [innerHTML]="link.label | safeHtml"
    title="{{ link.label }}"
    rel="{{ link.rel }}"
    [attr.data-href]="link.href"
    (click)="nav($event)"
  ></a>
</ng-template>
